<template>
  <div>
    <nav-bar
      bgColor="#ffb72f"
      titleColor="#fff"
      :supportWhiteBlack="true"
      title="关注公众号"
    ></nav-bar>
    <u-loading-page :loading="!qrCode"> </u-loading-page>
    <view class="qrCode-container">
      <image show-menu-by-longpress :src="qrCode" lazy-load class="qrCode" />
      <view class="text-30"> 长按图片关注公众号 </view>
    </view>
  </div>
</template>

<script>
import { genSubscribeQrcode } from "@/service/api/sp-common";

export default {
  name: "index",
  data() {
    return {
      qrCode: "",
    };
  },
  computed: {
    loading({ qrCode }) {
      return !qrCode;
    },
  },
  created() {
    this.fetchData();
  },
  methods: {
    async fetchData() {
      const res = await genSubscribeQrcode();
      if (res) {
        const { qrcodeUrl } = res;
        this.qrCode = qrcodeUrl;
      }
    },
  },
};
</script>

<style scoped lang="scss">
.qrCode-container {
  padding-top: 20rpx;
  text-align: center;
}
.qrCode {
  margin: 0 auto;
}
</style>
